<template>
  <div class="table-bg">
    <div>
      <div class="table-title">附表一 停复电统计表</div>
      <ColumnTable :showIndex="true" :tableColumn="emergencyColumn1"
        :tableData="tableData.dutyEmergencyStopStatisticsList" style="width: 100%" />
    </div>
    <div>
      <div class="table-title">附表二 各单位投入情况表</div>
      <ColumnTable :showIndex="true" :tableColumn="emergencyColumn2" :tableData="tableData.dutyEmergencyUnitIntoList"
        style="width: 100%" />
    </div>
    <div>
      <div class="table-title">附表三 天气预报情况</div>
      <ColumnTable :showIndex="true" :tableColumn="emergencyColumn3" :tableData="tableData.dutyEmergencyWeatherReportList"
        style="width: 100%" />
    </div>
  </div>
</template>
<script>
import ColumnTable from "../../../Daily/DailyDuty/columnTable/index.vue";
import {
  emergencyColumn1,
  emergencyColumn2,
  emergencyColumn3
} from "./config.js";
export default {
  components: {
    ColumnTable
  },
  props: {
    tableData: {
      type: Object,
      default: () => {
        return {
          dutyEmergencyStopStatisticsList: [],
          dutyEmergencyUnitIntoList: [],
          dutyEmergencyWeatherReportList: []
        };
      }
    }
  },
  provide() {
    return {
      isShow: () => false
    };
  },
  data() {
    return {
      emergencyColumn1,
      emergencyColumn2,
      emergencyColumn3
    };
  },
  methods: {

  }
};
</script>
<style lang="less" scoped>
.table-bg {
  background-color: #ecececbe;
  border: 1px solid #b6b6b6;
  border-radius: 6px;
  box-sizing: border-box;
  padding: 10px;
  margin-top: 20px;

  .table-title {
    font-size: 18px;
    padding: 10px 0;
  }

  :deep(.el-input__inner) {
    background-color: transparent;
  }

  :deep(.el-table--border, .el-table--group) {
    border-color: #d7d7d7;

    &::after {
      background-color: #d7d7d7;
    }
  }
}
</style>
